<template>
  <div class="time-box">{{dataNow}}</div>
</template>

<script>
export default {
  name: "Timebox",
  data() {
    return {
      dataNow: "",
      timerId: null
    };
  },
  mounted() {
    this.gw_now();
    this.timerId = setInterval(() => {
      this.gw_now();
    }, 1006);
  },
  methods: {
    gw_now_addzero(temp) {
      return temp < 10 ? "0" + temp : temp;
    },
    gw_now() {
      var obj;
      var date = new Date();
      var year = date.getFullYear();
      var month = this.gw_now_addzero(date.getMonth() + 1);
      var day = this.gw_now_addzero(date.getDate());
      var hour = this.gw_now_addzero(date.getHours());
      var minute = this.gw_now_addzero(date.getMinutes());
      var second = this.gw_now_addzero(date.getSeconds());
      var week;
      switch (date.getDay()) {
        case 0:
          week = "星期天";
          break;
        case 1:
          week = "星期一";
          break;
        case 2:
          week = "星期二";
          break;
        case 3:
          week = "星期三";
          break;
        case 4:
          week = "星期四";
          break;
        case 5:
          week = "星期五";
          break;
        case 6:
          week = "星期六";
          break;
      }
      obj =
        year +
        "-" +
        month +
        "-" +
        day +
        " " +
        week +
        " " +
        hour +
        ":" +
        minute +
        ":" +
        second;
      this.dataNow = obj;
    }
  },
  destroyed() {
    clearInterval(this.timerId);
    this.timerId = null;
  }
};
</script>

<style lang="less" scoped>
.time-box {
  width: 100%;
  height: 100%;
}
</style>
